<template>
  <view class="item-box" @click="handleItem(item)">
    <view class="content-header">
      <u-image
        width="40px"
        height="40px"
        :src="item[props.companyInfo][props.pic] || defaultPic"
      ></u-image>
      <view class="content-header-text">
        <text class="title">{{ item[props.title] }}</text>
        <span style="margin-top: 10rpx"
          ><text class="sub-title"
            >{{
              item[props.companyInfo][props.companyName] ||
              item[props.companyInfo][props.name]
            }}· {{ item[props.site] }}·{{
              item[props.jobType] == 1
                ? "全职"
                : item[props.jobType] == 2
                ? "实习"
                : "兼职"
            }}</text
          ></span
        >
      </view>
    </view>
    <view class="content-text"
      ><text class="content-text-title">岗位职责：</text
      >{{ item[props.summaryPositionDemand] || "未知"
      }}<text class="content-text-title">岗位要求：</text
      >{{ item[props.summarySkillsRequired] || "未知" }}</view
    >
    <view class="content-bottom">
      <view class="content-date">发布时间：{{ item[props.date] }}</view>
    </view>
  </view>
</template>

<script>
import { formatTime } from "@/utils/handle";
export default {
  props: {
    item: {
      type: Object,
      default() {
        return {};
      },
    },
    zpid: {
      type: [String, Number],
      default: "",
    },
    props: {
      type: Object,
      default() {
        return {
          title: "title",
          summaryPositionDemand: "summaryPositionDemand",
          summarySkillsRequired: "summarySkillsRequired",
          site: "site",
          companyInfo: "company",
          companyName: "shortName",
          name: "name",
          pic: "pic",
          jobType: "jobType",
          date: "date",
          id: "id",
        };
      },
    },
  },
  data() {
    return {
      defaultPic: this.$imgBaseSelf + "enterprises/icon_company_logo.png",
    };
  },
  methods: {
    handleItem(item) {
      this.$emit("itemClick", item);
    },
    // showTime(date) {
    //   const time = formatTime(date, "yyyy-MM-dd");
    //   return time;
    // },
  },
};
</script>

<style lang="scss">
.item-box {
  border-radius: 16rpx;
  background-color: #fff;
  margin: 30rpx;
  font-family: MiSans, MiSans;
  padding: 36rpx 32rpx;

  .content-header {
    display: flex;
    align-items: center;
    // justify-content: space-between;

    .content-header-text {
      display: flex;
      flex-direction: column;
      margin-left: 28rpx;

      .title {
        font-weight: 500;
        font-size: 26rpx;
        color: #222222;
        line-height: 26rpx;
      }

      .sub-title {
        font-weight: 400;
        font-size: 22rpx;
        color: #555555;
        line-height: 22rpx;
      }
    }
  }

  .content-text {
    font-weight: 400;
    font-size: 22rpx;
    color: #555555;
    line-height: 34rpx;
    margin-top: 26rpx;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5; /* 限制5行: ; */
    overflow: hidden;

    .content-text-title {
      color: #000000;
      font-weight: 600;
    }
  }

  .content-bottom {
    display: flex;
    justify-content: flex-end;
    margin-top: 26rpx;

    .content-date {
      font-weight: 400;
      font-size: 22rpx;
      color: #b0b0b0;
      line-height: 22rpx;
    }
  }
}
</style>
